<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
<%@ include file="navbar.jsp" %>

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
  <head>
    
    
    <title>My JSP 'edit_task.jsp' starting page</title>
    <link rel="stylesheet" type="text/css" href="styles/css/bootstrap.min.css" />
    <link rel="stylesheet" href="styles/sliderplugin/jslider.css" type="text/css">
	<link rel="stylesheet" href="styles/sliderplugin/jslider.blue.css" type="text/css">
	<!--[if IE 6]>
	<link rel="stylesheet" href="/test/css/jslider.ie6.css" type="text/css" media="screen">
	<link rel="stylesheet" href="/test/css/jsllider.blue.ie6.css" type="text/css" media="screen">
	<![endif]-->
	<link rel="stylesheet" href="styles/datepicker/css/datepicker.css" />
	

  </head>
  
  <body class="body">
    <div class="container" style="margin-top:60px;width:960px;margin-left:auto;margin-right:auto;">
	  <div class="row">
		<div class="span9">
	<form class="form-horizontal" action="goal.jspx?m=updateTask&id=${requestScope.task.taskId }" method="post" id="myform" >

        <fieldset>
          <legend>编辑任务</legend>
          
          <c:choose>
          	<c:when test="${(sessionScope.up.role) == 'manager' }">
          	<div class="control-group">
          		<label class="control-label" for="input01">任务名称</label>
		            <div class="controls">
		              <input style="height:28px;" type="text" class="span5" id="taskName" name="taskName"  value="${requestScope.task.taskName }" ><br />
					  <span id="span1" style="color:red;"></span>
		              <p class="help-block" style="color:green;">请输入您的任务名称…………</p>
            		</div>
          </div>
          <div class="control-group">
            <label class="control-label" for="input01">开始时间</label>
            <div class="controls">
              <div class="input-append date" id="dp3" data-date="12-02-2012" data-date-format="dd-mm-yyyy">
				 <input style="height:28px;" class="span2 datepicker" size="16" type="text" value="12-02-2012" name="startTime" value="${requestScope.task.startTime }">
			  </div>
            </div>
          </div>

          <div class="control-group">
            <label class="control-label" for="input01">截止时间</label>
            <div class="controls">
              <div class="input-append date" id="dp3" data-date="12-02-2012" data-date-format="dd-mm-yyyy">
				  <input style="height:28px;" class="span2 datepicker" size="16" type="text" value="12-02-2012" name="endTime" value="${requestScope.task.endTime }">
			  </div>
            </div>
          </div>
          
          <div class="control-group">
            <label class="control-label" for="input01">任务描述</label>

            <div class="controls">
              <textarea class="span5" name="desc" rows="8" id="desc" >${requestScope.task.desc }</textarea><br />
			  <span id="span2" style="color:red;"></span>
            </div>
          </div>
          
        <!--   <div class="control-group">
            <label class="control-label" for="multiSelect">状态</label>
            <div class="controls">
              <select id="multiSelect" name="state">

                <option>新任务</option>
                <option>进行中</option>
                <option>已完成</option>
              </select>
            </div>
          </div> -->
          
          <div class="control-group">
            <label class="control-label" for="multiSelect">级别</label>
            <div class="controls">
              <select id="multiSelect" name="level">
                <option>重要紧急</option>
                <option>重要不紧急</option>
                <option>紧急不重要</option>
                <option>不紧急不重要</option>

              </select>
            </div>
          </div>
          
          <div class="control-group">
            <label class="control-label" for="multiSelect">负责人</label>
            <div class="controls">
             
              <select id="multiSelect" name="manager">
              
              	<c:forEach items="${requestScope.userList}" var="u">
            		<option value="${u.userId }">${u.userName }</option>
            	</c:forEach>
               
              </select>
            </div>
          </div>
          
         
          	</c:when>
          	
          	<c:when test="${(sessionScope.up.role)== 'worker' }">
          <!-- 	  <div class="control-group">
            <label class="control-label" for="multiSelect">状态</label>
            <div class="controls">
              <select id="multiSelect" name="state">

                <option>新任务</option>
                <option>进行中</option>
                <option>已完成</option>
              </select>
            </div>
          </div> -->
          
          
          	<div class="control-group">
         
           		 <label class="control-label" for="input01">当前进度</label>

            <div class="controls">
            
            
            
            <!-- 使用滑动插件设置进度条 -->
            <p style="display: inline-block; width: 500px; ">
				<input id="sliderplugin" type="slider" name="taskRate" value="0" />
			</p>
			 
			 
            
            
            
            
            
            
            </div>
          </div>
          	</c:when>
          </c:choose>
            
          
          
          <div class="form-actions">
            <button type="button" class="btn btn-primary" id="btnSubmit">保存</button>
            <a href="goal.jspx?m=new&id=${param.id }" class="btn">返回</a>
          </div>

        </fieldset>
      </form>          
          	
		</div>
		<div class="span3">
			
		</div>
	  </div>
	</div>
	
	
	
	<script type="text/javascript" src="styles/jquery/jquery.js"></script>
	<script type="text/javascript" src="styles/sliderplugin/jquery.dependClass.js"></script>
	<script type="text/javascript" src="styles/sliderplugin/jquery.slider.js"></script>
	<script type="text/javascript" src="styles/datepicker/js/bootstrap-datepicker.js"></script>
	<script type="text/javascript">
		$(document).ready(function(){
			//设置进度条的值
			$(function(){
			    $("#sliderplugin").slider({
			        from: 0,  //初始值
			        to: 100,  //结束值
			        step: 1, //间隔
			        smooth: true,
			        round: 0, //小数点下
			        dimension: '&nbsp;%' //文本
			    });
			});
			
			
			
			$("#btnSubmit").click(function(){
			/*//验证任务名称
				var taskName = $("#taskName").val();			
				if(taskName.trim().length == 0){			//在验证表单时是不能用看是不是=null来判断的，因为提交到表单之后肯定是空，而不是null，名字不可以是空格
					$("#span1").html("任务名称不能为空！");
					$("#taskName").focus();
					return ;
				} 
				if(taskName.trim().length > 20){
					$("#span1").html("姓名最多不超过20位！");
					$("#taskName").focus();
					return;
				}
				
		
				
				
					
			//验证简介
				var desc = $("#desc").val();			
				if(desc.trim().length == 0){			
					$("#span2").html("任务描述不能为空！");
					$("#desc").focus();
					return ;
				} 
				if(desc.trim().length > 300){
					$("#span2").html("任务描述最多不超过300位！");
					$("desc").focus();
					return;
				}
				*/
				$("#myform").submit();
			});
			
			$(".datepicker").datepicker();
		});
	</script>
  </body>
</html>
